export const lazyPlugin = {
	install(app: any) {
		// app.directive("img-lazy", {
		// 	mounted(el, binding) {
		// 		useIntersectionObserver(
		// 			el,
		// 			([{ isIntersecting }]) => {
		// 				if(isIntersecting) {
		// 					el.src = binding.value;
		// 				}
		// 			},
		// 		)
		// 	}
		// });

		app.directive("img-lazy", {
			mounted(el: any, binding: any) {
				const observer = new IntersectionObserver((entries) => {
					for (const entry of entries) {
						if (entry.isIntersecting) {
							console.log("see");
							(entry.target as HTMLImageElement).src = binding.value;
							observer.unobserve(entry.target);
						}
					}
				});
				observer.observe(el);
				el._observer = observer;
			},
			unmounted(el: any) {
				el._observer?.disconnect();
			}
		});
	}
}